<template>
  <!-- 编辑弹窗 -->
  <a-modal title="钢筋技术优化-优化项" :visible="visible" :width="1010" @cancel="handleCancel" @ok="submit">
    <a-form-model ref="form" :model="objFrom" :rules="rules" hideRequiredMark>
      <a-row :gutter="24">
        <a-col :md="12" :sm="12">
          <a-form-model-item
            label="钢筋技术优化名称"
            :labelCol="{ lg: { span: 9 }, sm: { span: 9 } }"
            :wrapperCol="{ lg: { span: 13 }, sm: { span: 13 } }"
            prop="name"
          >
            <BaseInput :maxLength="50" v-model="objFrom.name" />
          </a-form-model-item>
        </a-col>
        <a-col :md="12" :sm="12">
          <a-form-model-item
            label="钢筋技术优化量(t)"
            :labelCol="{ lg: { span: 9 }, sm: { span: 9 } }"
            :wrapperCol="{ lg: { span: 13 }, sm: { span: 13 } }"
            prop="optimizationAmount"
          >
            <BaseInputNumber :maxLength="20" v-model="objFrom.optimizationAmount" />
          </a-form-model-item>
        </a-col>
        <a-col :md="12" :sm="12">
          <a-form-model-item
            :label="typeYear + '钢筋工程使用总量(t)'"
            :labelCol="{ lg: { span: 12 }, sm: { span: 12 } }"
            :wrapperCol="{ lg: { span: 10 }, sm: { span: 10 } }"
            prop="engineeringAmount"
          >
            <BaseInputNumber :disabled="objFrom.disabled" :maxLength="20" v-model="objFrom.engineeringAmount" />
          </a-form-model-item>
        </a-col>
        <a-col :md="12" :sm="12">
          <a-form-model-item
            label="钢筋技术优化效益(万元)"
            :labelCol="{ lg: { span: 9 }, sm: { span: 9 } }"
            :wrapperCol="{ lg: { span: 13 }, sm: { span: 13 } }"
            prop="optimizationBenefit"
          >
            <BaseInputNumber :maxLength="20" v-model="objFrom.optimizationBenefit" />
          </a-form-model-item>
        </a-col>
        <a-col :md="12" :sm="12">
          <a-form-model-item
            :label="typeYear + '钢筋工程总造价(万元)'"
            :labelCol="{ lg: { span: 12 }, sm: { span: 12 } }"
            :wrapperCol="{ lg: { span: 10 }, sm: { span: 10 } }"
            prop="engineeringPrice"
          >
            <BaseInputNumber :disabled="objFrom.disabled" :maxLength="20" v-model="objFrom.engineeringPrice" />
          </a-form-model-item>
        </a-col>
        <a-col :md="12" :sm="12">
          <a-form-model-item
            label="钢筋技术优化效益率（%）"
            :labelCol="{ lg: { span: 9 }, sm: { span: 9 } }"
            :wrapperCol="{ lg: { span: 13 }, sm: { span: 13 } }"
          >
            <BaseInput disabled v-model="optimizationRate" />
          </a-form-model-item>
        </a-col>
      </a-row>
    </a-form-model>
  </a-modal>
</template>

<script>
import { call } from 'lodash.pick'
export default {
  name: 'a' + Date.now(),
  props: {
    visible: {
      type: Boolean,
      required: true
    },
    model: {
      type: Object,
      default() {
        return {}
      }
    },
    typeYear: {
      type: String,
      typeYear: ''
    }
  },
  watch: {
    model(val) {
      this.objFrom = { ...val }
    }
  },
  computed: {
    optimizationRate() {
      const { optimizationBenefit, engineeringPrice } = this.objFrom
      if (!engineeringPrice || engineeringPrice == 0) return '0.00'
      const result = (optimizationBenefit / engineeringPrice) * 100
      return isNaN(result) ? '0.00' : result.toFixed(2)
    }
  },
  data() {
    const validNumberSize = (rule, value, callback) => {
      let flag = true
      const map = {
        optimizationAmount: formInfo => {
          flag = this.compareWithNumber(formInfo.engineeringAmount, formInfo.optimizationAmount)
          if (!flag) {
            callback(new Error(`不能大于${this.typeYear}钢筋工程使用总量`))
          } else {
            this.$refs.form.validateField('optimizationAmount')
          }
        },
        engineeringAmount: formInfo => {
          flag = this.compareWithNumber(formInfo.engineeringAmount, formInfo.optimizationAmount)
          if (!flag) {
            callback(new Error('不能小于钢筋技术优化量'))
          } else {
            this.$refs.form.validateField('engineeringAmount')
          }
        },
        optimizationBenefit: formInfo => {
          flag = this.compareWithNumber(formInfo.engineeringPrice, formInfo.optimizationBenefit)
          if (!flag) {
            callback(new Error(`不能大于${this.typeYear}钢筋工程总造价`))
          } else {
            this.$refs.form.validateField('optimizationBenefit')
          }
        },
        engineeringPrice: formInfo => {
          flag = this.compareWithNumber(formInfo.engineeringPrice, formInfo.optimizationBenefit)
          if (!flag) {
            callback(new Error('不能小于钢筋技术优化效益'))
          } else {
            this.$refs.form.validateField('engineeringPrice')
          }
        }
      }
      map[rule.field] && map[rule.field](this.objFrom)
      flag && callback()
    }
    return {
      objFrom: {},
      rules: {
        name: [{ required: true, message: '请输入', trigger: 'change' }],
        optimizationAmount: [
          { required: true, message: '请输入', trigger: 'change' },
          { validator: validNumberSize, trigger: 'change' }
        ],
        engineeringAmount: [
          { required: true, message: '请输入', trigger: 'change' },
          { validator: validNumberSize, trigger: 'change' }
        ],
        optimizationBenefit: [
          { required: true, message: '请输入', trigger: 'change' },
          { validator: validNumberSize, trigger: 'change' }
        ],
        engineeringPrice: [
          { required: true, message: '请输入', trigger: 'change' },
          { validator: validNumberSize, trigger: 'change' }
        ]
      }
    }
  },
  methods: {
    /**
     * 比较两数大小，后者大于或等于前者返回true；反之，返回false
     */
    compareWithNumber(num1, num2) {
      if ((!num1 && num1 !== 0) || (!num2 && num2 !== 0)) {
        return true
      }
      const firstNum = +num1
      const secondNum = +num2
      if (!Number.isFinite(firstNum) || !Number.isFinite(secondNum)) {
        return true
      }
      return firstNum >= secondNum
    },
    WriteTime(a, b) {
      this.objFrom.nnnnn = b
    },
    submit() {
      this.$refs.form.validate(valid => {
        if (!valid) return
        this.$emit('ok', { ...this.objFrom, optimizationRate: this.optimizationRate })
      })
    },
    handleCancel() {
      this.$emit('cancel')
      this.$refs.form.resetFields()
    }
  }
}
</script>

<style></style>
